import { Component } from '@angular/core';
import { CartService } from '../app/CartService';
import { Product } from '../app/Product';
import { FormBuilder } from '@angular/forms';

@Component({
  selector: 'app-cart',
  templateUrl: './cart.component.html',
  styleUrls: ['./cart.component.less'],
  providers: [CartService]
})
export class CartComponent {
  items: Product[] = []
  // items = this.cartService.getItems();

  checkoutForm = this.formBuilder.group({
    name: '',
    address: ''
  });

  constructor(
    private cartService: CartService,
    private formBuilder: FormBuilder
  ) { }

  ngOnInit() {
    console.error("cart.component.ts ==> ngOnInit()");
    this.items = this.cartService.getItems();
    console.log("cart ngOnInit items", this.items);
  }

  onSubmit(): void {
    this.items = this.cartService.clearCart();
    console.warn('Your order has been submitted', this.checkoutForm.value);
    this.checkoutForm.reset();
  }
}
